{extend name="public/layout" /}
{block name="main"}
<style>
    .hha{
        text-align: center;
    }
</style>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <div class="layui-row" style="width: 100%;margin-top: 15px;min-height: 40px">
        {include file='table/toolbarDemo' /}
    </div>
</fieldset>
{if $over['page']??null}
<table class="layui-table" style="width: 100%;" lay-data="{height: 'full-100', cellMinWidth: 80, url:'{$over['action']|default=''}', page:{layout:['count', 'prev','page','next','limit','refresh','skip']},limits:[10,20,30,40,50,60,70,80,90], id:'idTest'}" lay-filter="demo">
    {else}
    <table class="layui-table" style="width: 100%;" lay-data="{height: 'full-100', cellMinWidth: 80, url:'{$over['action']|default=''}', id:'idTest'}" lay-filter="demo">
    {/if}
    <thead>
    <tr>
        <th lay-data="{type:'checkbox',field:'id', fixed: 'left',align:'center'}"></th>
        <th lay-data="{field:'id', align:'center'}" >ID</th>
        {foreach $column as $value}


        {if $value['type']=='input'}
        {if $value['width']}
        <th lay-data="{field:'{$value['name']}', width:{$value['width']},style:'{$value['style']}',align:'{$value['align']}'}">{$value['desc']}</th>
        {else}
        <th lay-data="{field:'{$value['name']}', style:'{$value['style']}',align:'{$value['align']}'}" >{$value['desc']}</th>
        {/if}
        {/if}

        {if $value['type']=='edit'}
        {if $value['width']}
        <th lay-data="{field:'{$value['name']}',edit:'text', width:{$value['width']},style:'{$value['style']}',align:'{$value['align']}'}">{$value['desc']}</th>
        {else}
        <th lay-data="{field:'{$value['name']}', edit:'text',style:'{$value['style']}',align:'{$value['align']}'}" >{$value['desc']}</th>
        {/if}
        {/if}

        {if $value['type']!=='input'}
        {if $value['width']}
        <th lay-data="{field:'{$value['name']}', width:{$value['width']},style:'{$value['style']}',templet:'#{$value['name']}',align:'{$value['align']}'}">{$value['desc']}</th>
        {else}
        <th lay-data="{field:'{$value['name']}',style:'{$value['style']}',templet:'#{$value['name']}',align:'{$value['align']}'}">{$value['desc']}</th>
        {/if}
        {/if}

        {/foreach}
        <th lay-data="{fixed: 'right',width:{$over['rightheader']['width']}, align:'center', toolbar: '#barDemo',align:'center'}">{$over['rightheader']['desc']}</th>
    </tr>
    </thead>
</table>
<script type="text/html" id="barDemo">
    {foreach $button as $value}

    {if $value['type']=='button'}
    <a class="layui-btn layui-btn-xs {$value['class']}" style="{$value['style']}" lay-event="right"  data-id="{{d.id}}" data-action="{$value['action']}" >{$value['desc']|default='按钮'}</a>
    {/if}

    {if $value['type']=='edit'}
    <a class="layui-btn layui-btn-xs {$value['class']}" style="{$value['style']}" lay-event="edit"  data-id="{{d.id}}" data-action="{$value['action']}" >{$value['desc']|default='编辑'}</a>
    {/if}

    {if $value['type']=='add'}
    <a class="layui-btn layui-btn-xs {$value['class']}" style="{$value['style']}" lay-event="edit"  data-id="{{d.id}}" data-action="{$value['action']}" >{$value['desc']|default='添加'}</a>
    {/if}

    {if $value['type']=='detail'}
    <a class="layui-btn layui-btn-primary layui-btn-xs {$value['class']}" style="{$value['style']}" lay-event="detail"  data-id="{{d.id}}" data-action="{$value['action']}" >{$value['desc']|default='查看'}</a>
    {/if}

    {if $value['type']=='del'}
    <a class="layui-btn layui-btn-danger layui-btn-xs {$value['class']}" style="{$value['style']}" lay-event="del"  data-id="{{d.id}}" data-action="{$value['action']}" >{$value['desc']|default='删除'}</a>
    {/if}

    {if $value['type']=='a'}
    <a class="layui-btn  layui-btn-normal layui-btn-xs {$value['class']}" style="{$value['style']}" lay-event="right"  data-id="{{d.id}}" href="{$value['action']}?id={{d.id}}" >{$value['desc']|default='跳转'}</a>
    {/if}

    {/foreach}
</script>
{include file="table/template" /}
{/block}
{block name="script"}
<script>
layui.use('table',function () {
    var table = layui.table;
    var form = layui.form;
    var laydate = layui.laydate;

    /**
     * 重构表格
     */
    function onreloader() {
        var tiaojian = {};
        var tiji = $("#sousuo").val();
        var ntype = $("#sousuos").val();
        var cid = '{$over["cid"]|default=""}';
        if(cid){
            tiaojian.cid = cid;
        }
        var model_id = '{$over["model_id"]|default=""}';
        if(model_id){
            tiaojian.model_id = model_id;
        }
        tiaojian.tiaojian = tiji;
        if(ntype){
            tiaojian.field = ntype;
        }
        var curr = $(".layui-laypage-curr").children('em').eq(1).text();
        // if(curr){
        //     tiaojian.page = 1;
        // }
        // tiaojian.page = 1;
        console.log(tiaojian);
        var ispage = '{$over["page"]}';
        if(ispage!==''){
            table.reload('idTest', {
                page: {
                    curr: curr //重新从第 1 页开始
                }
                ,where: tiaojian
            });
        }else{
            location.reload();
        }
        // $("[data-page="+tiaojian.page+"]").click();
    }

    /**
     * 监听编辑input
     */
    table.on('edit',function (obj) {
        console.log(obj);
        // console.log($(this))
        var tiaojian = {};
        var id = obj.data.id;
        if(id){
            tiaojian.id = id;
        }
        var field = obj.field;
        if(field){
            tiaojian.field = field;
        }
        var value = obj.value;
        if(value){
            tiaojian.value = value;
        }
        var action = '{$monitoraction["edit"]|default=""}';
        var cid = '{$over["cid"]|default=""}';
        if(cid){
            tiaojian.cid = cid;
        }
        var model_id = '{$over["model_id"]|default=""}';
        if(model_id){
            tiaojian.model_id = model_id;
        }
        // console.log(action);
        // return
        if(action){
            var index = layer.load(0, {shade: false});
            $.post(action,tiaojian,function (res) {
                console.log(res)
                layer.close(index);
                layer.msg(res.msg);
                setTimeout(function () {
                    onreloader();
                },100)
            })
        }
    })

    /**
     * 监听行间的按钮，如查看，删除，修改
     * */
    table.on('tool(demo)',function (obj) {
        console.log(obj)
        var cid = '{$over["cid"]|default=""}';
        var model_id = '{$over["model_id"]|default=""}';
        var action = $(this).attr('data-action');
        var tiaojian = {data:obj.data};
        var id = obj.data.id;
        if(id){
            tiaojian.id = id;
        }
        var field = $(this).attr('data-field');
        if(field){
            tiaojian.field = field;
        }
        var type = obj.event;
        if(cid){
            tiaojian.cid = cid;
        }
        if(model_id){
            tiaojian.model_id = model_id;
        }
       //  console.log(type);
       //  console.log(action);
       // return
       //  console.log(tiaojian);
        // return;
        if(action){
            if(Object.keys(tiaojian).length>0){
                action = action+'?';
            }
            $.each(tiaojian,function (i,v) {
                action+=i+'='+v+'&';
            })
            if(type=='edit'||type=='detail'){
                if(type!=='detail'){
                    layer.open({
                        type:2,
                        area:['80%','90%'],
                        content:action,
                        end:function () {
                            onreloader();
                        }
                    })
                }else{
                    layer.open({
                        type:2,
                        area:['80%','90%'],
                        content:action,
                        end:function () {

                        }
                    })
                }
            }else{
                if(type=='del'){
                    layer.confirm('确定要进行这个操作吗？', {
                        btn: ['确定','取消'] //按钮
                    }, function(){
                        var index = layer.load(0, {shade: false});
                        $.post(action,tiaojian,function (res) {
                            console.log(res);
                            layer.msg(res.msg);
                            layer.close(index);
                            if(type!=='detail'){
                                setTimeout(function () {
                                    onreloader();
                                },100)
                            }
                        })
                        return;
                    });
                    return
                }
                var index = layer.load(0, {shade: false});
                $.post(action,tiaojian,function (res) {
                    layer.close(index);
                    layer.msg(res.msg);
                    if(type!=='detail'){
                        setTimeout(function () {
                            onreloader();
                        },100)
                    }
                })
            }
        }
    })
    var active = {
        //监听全删除
        alldel:function (obj) {
            // console.log('全删除')
            var action = $(this).attr('data-action');
            var checkStatus = table.checkStatus('idTest');
            var cid = '{$over["cid"]|default=""}';
            var tiaojian = {data:checkStatus.data};
            if(cid){
                tiaojian.cid = cid;
            }
            var model_id = '{$over["model_id"]|default=""}';
            if(model_id){
                tiaojian.model_id = model_id;
            }
            var id = [];
            $.each(checkStatus.data,function (i,v) {
                id.push(v.id);
            });
            if(id.length>0){
                tiaojian.id = id;
            }else{
                layer.msg('请选择数据!!');
                return
            }
            layer.confirm('确定要执行这个操作吗？', {
                btn: ['确定','取消'] //按钮
            }, function(){
                var index = layer.load(0, {shade: false});
                $.post(action,tiaojian,function (res) {
                    console.log(res);
                    layer.close(index);
                    layer.msg(res.msg);
                    onreloader();
                })
                return;
            });
            // console.log(tiaojian);
        },
        //监听添加
        add:function (obj) {
            var action = $(this).attr('data-action');
            var cid = '{$over["cid"]|default=""}';
            var model_id = '{$over["model_id"]|default=""}';
            var str = '';
            if(cid){
                if(str){
                    str+='cid='+cid;
                }else{
                    str+='?cid='+cid;
                }
            }
            if(model_id){
                if(str){
                    str+='model_id='+model_id;
                }else{
                    str+='?model_id='+model_id;
                }
            }
            layer.open({
                type:2,
                area:['80%','90%'],
                content:action+str,
                end:function () {
                    onreloader();
                }
            })
        },
        //监听返回
        back:function (obj) {
            history.back();
        },
        //监听搜索
        reload:function (obj) {
            onreloader();
        }
    }

    $('.demoTable').on('click', function(){
        var type = $(this).attr('lay-event');
        // console.log(type);
        active[type] ? active[type].call(this) : '';
    });
    $(".demoTables").on('change',function () {
        console.log('改变')
        onreloader();
    })
    /**
     * 监听开关
     */
    form.on('switch', function(obj){
        var tiaojian = {};
        var id = $(this).attr('value');
        if(id){
            tiaojian.id = id;
        }
        var field = $(this).attr('field');
        if(field){
            tiaojian.field = field;
        }
        var action = '{$monitoraction["switch"]|default=""}';
        var cid = '{$over["cid"]|default=""}';
        if(cid){
            tiaojian.cid = cid;
        }
        var model_id = '{$over["model_id"]|default=""}';
        if(model_id){
            tiaojian.model_id = model_id;
        }
        console.log(action);
        if(action){
            var index = layer.load(0, {shade: false});
            $.post(action,tiaojian,function (res) {
                console.log(res)
                layer.close(index);
                layer.msg(res.msg);
                setTimeout(function () {
                    onreloader();
                },100)
            })
        }

    });

})
    function tableyulan(obj) {
        var src = $(obj).attr('src');
        layer.open({
            type: 1,
            skin: 'layui-layer-rim', //加上边框
            area: ['80%', '90%'], //宽高
            content: '<div style="width: 100%;text-align: center"><img src="'+src+'" /></div>'
        });
    }
</script>
{/block}